<template>
  <view class="app-container">
    <view class="title-padding"></view>
    <view class="">
      <view class="flex-item flex-item-V textarea-container">
        <textarea
          v-model="content"
          placeholder-style="color:#71808A; font-size: 28upx"
          placeholder="意见描述(最多输入200字)"
          :maxlength="200"
        />
      </view>
      <view class="flex-item flex-item-V submit-container">
        <button
          @click="handleSubmitFeedBack"
          :disabled="content.length <= 0"
          class="cu-btn shadow"
          :class="content.length > 0 ? 'active' : ''"
        >
          提交
        </button>
      </view>
    </view>
  </view>
</template>

<script>
import { submitFeedBack } from '../../api/user.js'
export default {
  data() {
    return {
      content: '',
    }
  },
  methods: {
    handleSubmitFeedBack() {
      submitFeedBack({ content: this.content })
        .then(res => {
          // console.log(res)
          if (res.code === 1) {
            uni.showToast({
              title: res.msg,
              icon: 'success',
            })
            setTimeout(() => {
              uni.navigateTo({
                url: '/pages/ucenter/index',
              })
            }, 1500)
          } else if (res.msg) {
            uni.showToast({
              title: res.msg,
              icon: 'none',
            })
          }
        })
        .catch(err => {
          uni.showToast({
            title: '提交失败！',
            icon: 'none',
          })
        })
    },
  },
}
</script>

<style lang="scss" scoped>
.app-container {
  width: 100%;
  height: 100vh;
  background-color: #ffffff;
  justify-content: space-between;
  .textarea-container {
    margin: 20upx 30upx;
    height: 600upx;
    padding: 30upx;
    border-radius: 12upx;
    background-color: #f9fafe;
  }
  .submit-container {
    height: 100upx;
    margin: 20upx 30upx;
    margin-top: 240upx;
    .cu-btn {
      width: 100%;
      height: 100upx;
      background: #edf2f6;
      border-radius: 50upx;
      text-align: center;
      font-size: 36upx;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: rgba(113, 128, 138, 1);
      line-height: 100upx;

      &.active {
        background: #149eff;
        color: #ffffff;
      }
    }
  }
}
</style>
